<template>
    <div>
        <span style="color: brown;">*发版文件路径以及替换路径请定位到 /gkpt-web。 例如：【{{ tigPath }}】</span>
        <div class="container">
            <div class="con-left">
                <el-input v-model="myPath" style="max-width: 500px" placeholder="请输入文件路径">
                    <template #append>
                        <el-button @click="handleSearch">查 询</el-button>
                    </template>
                </el-input>
                <div style="display: flex;justify-content: space-between;margin-top: 10px;">
                    <div>待替换文件总数：{{ total }}</div>
                </div>
                <ul class="my-list">
                    <div
                        style="margin-bottom: 20px;white-space:nowrap;"
                        v-for="(item,index) in listData"
                        :key="index"
                    >{{ item }}</div>
                </ul>
            </div>
            <div class="con-right">
                <el-input v-model="ptPath" style="max-width: 500px" placeholder="请输入替换文件路径">
                    <template #append>
                        <el-button type="primary" @click="handleReplace">替 换</el-button>
                    </template>
                </el-input>
                <div style="margin-top: 10px;">更新总数：{{ replaceTotal + moveTotal }}</div>
                <ul class="my-list">
                    <div>新文件添加 {{ moveTotal }}</div>
                    <div
                        style="margin-bottom: 20px;white-space:nowrap;"
                        v-for="(item,index) in moveData"
                        :key="index"
                    >{{ item }}</div>
                    <el-divider />
                    <div>文件替换 {{ replaceTotal }}</div>
                    <div
                        style="margin-bottom: 20px;white-space:nowrap;"
                        v-for="(item,index) in relpaceData"
                        :key="index"
                    >{{ item }}</div>
                </ul>
            </div>
        </div>
    </div>
</template>

<script setup>
import { ref } from 'vue'
import { ipc } from '@/utils/ipcRenderer'
import { ipcApiRoute } from '@/api/main.js'
import { ElMessage } from 'element-plus'
const tigPath = ref("C:\\Users\\DELL\\Desktop\\test\\gkpt-web")
const myPath = ref('')
const ptPath = ref('')
const listData = ref([])
const relpaceData = ref([])
const moveData = ref([])
const total = ref(0)
const replaceTotal = ref(0)
const moveTotal = ref(0)
const handleSearch = () => {
    ipc.invoke(ipcApiRoute.fsSearch, { path: myPath.value }).then(r => {
        listData.value = r.list
        total.value = r.total
    })
}
const handleReplace = () => {
    if (listData.value.length === 0) {
        ElMessage.error('木有文件可以替换~')
        return
    }
    if (!ptPath.value) {
        ElMessage.error('请选择替换目录~')
        return
    }
    ipc.invoke(ipcApiRoute.fsReplace, { path: myPath.value, path2: ptPath.value }).then(r => {
        relpaceData.value = r.replaceFiles
        moveData.value = r.moveFiles
        replaceTotal.value = r.replaceTotal
        moveTotal.value = r.moveTotal
        if (r.total === total.value) {
            ElMessage({
                message: `${total.value}个文件成功更新~`,
                type: 'success',
            })
        }
    })
}
</script>

<style lang="less" scoped>
.container {
    height: 80vh;
    width: 100%;
    display: flex;
    justify-content: space-between;
    .con-left {
        width: 50%;
        height: 100%;
        border-right: 2px solid #c7e2fe;
        padding-right: 15px;
    }
    .con-right {
        width: 50%;
        height: 100%;
        padding-left: 15px;
    }
}
.my-list {
    height: 80%;
    width: 95%;
    overflow: auto;
    padding: 0 20px 0 0;
}
</style>